/**
 * The Spinner user-interface component class
 * @class syslib.ui.Spinner
 * @author Gabriel Ricci
 */

syslib.ui.Spinner = __class(syslib.ui.VisualTag, 
/**
 * @lends syslib.ui.Spinner
 */
{
	prepare : function(){
		// STYLE
		syslib.loadStyleForComponent("spinner");

		// TAG ATTRIBUTES
		var attributes = this.__attributes;

		// CLASS ATTRIBUTES
		this.addProperty("string", "id", "");
		this.addProperty("number", "defaultValue", 0);
		this.addProperty("number", "currentValue", 0);
		this.addProperty("number", "start", 0);
		this.addProperty("number", "end", 0);
		this.addProperty("number", "step", 1);
		this.addProperty("boolean", "loop", false);

		// SETS
		this.setId( (__valid(attributes.id)) ? attributes.id : "spinner_" + Math.floor(Math.random() * 1001) );
		if(__valid(attributes.defaultvalue)) { this.setDefaultValue(attributes.defaultvalue);}
		if(__valid(attributes.start)) { this.setStart(attributes.start);}
		if(__valid(attributes.end)) { this.setEnd(attributes.end);}
		if(__valid(attributes.step)) { this.setStep(attributes.step);}
		if(__valid(attributes.loop) && attributes.loop == "true" || attributes.loop == true) { this.setLoop(true);}

		if(this.getDefaultValue() < this.getStart()){
			this.setDefaultValue(this.getStart());
		}
		if(this.getDefaultValue() > this.getEnd()){
			this.setDefaultValue(this.getEnd());
		}

		this.setCurrentValue(this.getDefaultValue());
		
		// RETURN 
		return true;
	},

	execute : function(){
		// ATTRIBUTES
		var attributes = syslib.object.extend(this.__attributes, {
			"type" : "text",
			"value" : this.getCurrentValue(),
			"class" : "spinner_input",
			"innerName" : "input"
		});

		// JSON STRUCTURE
		var elemtJSON = ["table", {"class" : "spinner_global_container", "border" : "0", "cellpadding" : "0", "cellspacing" : "0"},
							["tbody",
								["tr",
									["td", {"rowspan" : "2", "class" : "spinner_input_container", "innerName" : "inputContainer"},
										["input", attributes]
									],
									["td", {"valign" : "middle"},
										["div", {"class" : "spinner_buttons_container"},
											["div", {"class" : "spinner_upbutton_normal", "innerName" : "upButton"}]
										]
									]
								],
								["tr",
									["td", {"valign" : "bottom"},
										["div", {"class" : "spinner_buttons_container"},
											["div", {"class" : "spinner_downbutton_normal", "innerName" : "downButton"}]
										]
									]
								]
							]
						];

		// CREATE ELEMENT
		var spinner = this.createDOM(elemtJSON);

		// RETURN
		return spinner;
	},

	finalize : function(){
		syslib.event.listen("mouseover", this.__refs.upButton, function(){
			this.__refs.upButton.className = "spinner_upbutton_over";
		}.applyTo(this));
		syslib.event.listen("mouseout", this.__refs.upButton, function(){
			this.__refs.upButton.className = "spinner_upbutton_normal";
		}.applyTo(this));
		syslib.event.listen("mousedown", this.__refs.upButton, function(){
			this.__refs.upButton.className = "spinner_upbutton_clicked";
			this.up();
		}.applyTo(this));
		syslib.event.listen("mouseup", this.__refs.upButton, function(){
			this.__refs.upButton.className = "spinner_upbutton_over";
		}.applyTo(this));

		syslib.event.listen("mouseover", this.__refs.downButton, function(){
			this.__refs.downButton.className = "spinner_downbutton_over";
		}.applyTo(this));
		syslib.event.listen("mouseout", this.__refs.downButton, function(){
			this.__refs.downButton.className = "spinner_downbutton_normal";
		}.applyTo(this));
		syslib.event.listen("mousedown", this.__refs.downButton, function(){
			this.__refs.downButton.className = "spinner_downbutton_clicked";
			this.down();
		}.applyTo(this));
		syslib.event.listen("mouseup", this.__refs.downButton, function(){
			this.__refs.downButton.className = "spinner_downbutton_over";
		}.applyTo(this));

		if(__valid(this.__attributes.width)){
			var width = this.__attributes.width;
			this.__refs.input.style.width 			= width + "px";
			this.__refs.inputContainer.style.width	= width + "px";
		}
	},

	up : function(){
		var currvalue	= parseInt(this.getCurrentValue());
		var workvalue	= parseInt(currvalue + parseInt(this.getStep()));

		if(workvalue > this.getEnd()){
			if(this.getLoop() === true){
				this.setCurrentValue(this.getStart());
				this.__refs.input.value = this.getCurrentValue();
			}
		} else {
			this.setCurrentValue(workvalue);
			this.__refs.input.value = this.getCurrentValue();
		}
	},

	down : function(){
		var currvalue	= parseInt(this.getCurrentValue());
		var workvalue	= parseInt(currvalue - parseInt(this.getStep()));

		if(workvalue < this.getStart()){
			if(this.getLoop() === true){
				this.setCurrentValue(this.getEnd());
				this.__refs.input.value = this.getCurrentValue();
			}
		} else {
			this.setCurrentValue(workvalue);
			this.__refs.input.value = this.getCurrentValue();
		}
	}
});